import { Tabs } from "antd-mobile"
import { useTabs } from "./useTab"
import HomeList from "./components/list/list"
import './index.css'

const Home = () => {
  const { channels } = useTabs()

  return (
    <div>
      <div className="tabs">
        <Tabs defaultActiveKey={'0'}>
          {
            channels.map((item) => (
              <Tabs.Tab title={item.name} key={item.id}>
                <div className="list">
                  <HomeList channel_id={item.id}></HomeList>
                </div>
              </Tabs.Tab>
            ))
          }
        </Tabs>
      </div>
    </div>
  )
}
export default Home